﻿<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<html>
<head>
    <link rel="stylesheet" href="${ctx}/common/common.css">
    <title>Title</title>
    <link rel="stylesheet" href="${ctx}/common/plugins/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${ctx}/common/plugins/layuiadmin/style/admin.css" media="all">
    <script src="${ctx}/common/plugins/layuiadmin/layui/layui.js"></script>

</head>
<style>
    .pricessName {
        background-color: #FFB800;
        border-radius: 10px;
        color: white;
        width: 150px;
        height: 150px;
        margin-left: 5%;
        line-height: 150px;
        text-align: center;
        margin-top: 20px;
        margin-bottom: 20px
    }

    .pricessValue {
        padding-right: 20px;
        padding-top: 20px;
        width: 60%
    }

    .pricessValue li {
        border-bottom: 1px #0e9aef dashed;
        margin-top: 5px;
        padding-top: 10px;
        padding-bottom: 10px
    }

    .pricessValue li > div {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap
    }

    .topCard {
        display: flex;
        flex-direction: row;
        width: 240px;
        height: 50px;
        margin-left: 50px;
        margin-top: 20px
    }

    .topCard > div {
        color: white;
        line-height: 50px;
        text-align: center
    }

    .add_fanhui {
        position: absolute;
        top: 35px;
        right: 40px;
    }
</style>
<body>
<div>
    <%--顶部信息--%>
    <div class="topCard">
        <div style="width: 30%;background-color: #1a7bb9;">加工单号</div>
        <div style="width: 70%;background-color: #0e9aef;">
            <c:if test="${!empty productionProcessList && productionProcessList.size()>0}">
                ${productionProcessList.get(0).workCode}
            </c:if>
        </div>
    </div>
    <div class="layui-form-item add_fanhui">
        <div class="layui-input-block">
            <button type="button" id="rollback" class="layui-btn layui-btn-primary">返回</button>
        </div>
    </div>
    <%--工艺流程内容--%>
    <c:forEach items="${productionProcessList}" var="productionProcess">
        <div style="padding-bottom: 20px;border-radius: 10px;margin-left: 50px;width: 90%;border: 1px solid #00F7DE;display: flex;flex-direction: row;justify-content: space-between;margin-top: 50px">
                <%--左--%>
            <div class="pricessName">
                <span>${productionProcess.name}</span>
            </div>
                <%--右--%>
            <div class="pricessValue">
                <ul>
                    <c:forEach items="${productionProcess.technicIndexList}" var="technicIndex">
                        <c:if test="${technicIndex.quota_type eq '1'   || technicIndex.quota_type eq '2' || technicIndex.quota_type eq '3' || technicIndex.quota_type eq '4'}">
                            <li>
                                    ${technicIndex.name}：${technicIndex.g_value}
                                <c:if test="${!empty technicIndex.g_value}">
                                    ${technicIndex.unit}
                                </c:if>
                            </li>

                        </c:if>
                        <c:if test="${technicIndex.quota_type eq '5'}">
                            <li>
                                    ${technicIndex.name}：
                                <div>
                                    <c:if test="${!empty technicIndex.turl}">
                                        <img style="width: 150px;height: 150px" src="${ctx}${technicIndex.turl}">
                                    </c:if>
                                </div>
                            </li>
                        </c:if>
                        <c:if test="${technicIndex.quota_type eq '6'}">
                            <li>
                                    ${technicIndex.name}：
                                <div>
                                    <video width="150" height="150" controls preload="auto"
                                           src="${ctx}${technicIndex.turl}"></video>
                                </div>
                            </li>
                        </c:if>
                    </c:forEach>
                </ul>
            </div>
        </div>
    </c:forEach>
</div>
<script>
    document.getElementById("rollback").addEventListener("click", function () {
        window.history.back();
    })
</script>
</body>
</html>



